<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <base target="_blank"/>
    <title>自定义控制器</title>
    <script src="plugin/angular.min.js"></script>

    <script>
        /*
        * 自定义模块&Controller
        *  $scope贯穿整个AngularJS App应用，它与数据模型相关联，同时也是表达式执行的上下文
        *  是建立在视图和控制器之间得通道，基于作用域视图在修改数据时会立刻更新$scope,发生改变时也会立刻重新渲染视图
        * */
        //定义了名称为myApp的模块
        var app = angular.module('myApp', []);
        //定义控制器
        app.controller('myController', function ($scope) {
            $scope.add = function () {
                return parseInt($scope.x) + parseInt($scope.y);
            }
            $scope.div = function () {
                $scope.res = parseInt($scope.x) / parseInt($scope.y);
            }
        });

    </script>
</head>

<!--使用自定义的模块和控制器-->
<body ng-app="myApp" ng-controller="myController">


<input type="text" ng-model="x"> + <input type="text" ng-model="y" value="2"> = {{add()}}

<!--事件绑定-->
<button ng-click="div()">计算</button>
,结果为{{res}}

</body>
</html>